<template>
    <div>
        <button @click="currentTab = 'Tab1'">音乐</button>
        <button @click="currentTab = 'Tab2'">视频</button>
        <button @click="currentTab = 'Tab3'">新闻</button>
        <keep-alive>
            <component :is="currentTab"></component>
        </keep-alive>
    </div>
</template>
<script>
import Tabl from "./4-6 TabCom1.vue";
import Tab2 from "./4-6 TabCom2.vue";
import Tab3 from "./4-6 TabCom3.vue";
export default {
    data() {
        return {
            currentTab: "Tabl",
        };
    },
    //注册组件
    components: {
        Tabl,
        Tab2,
        Tab3,
    },
};
</script>
<style scoped></style>